<template>
    <view class="bg-content">
        <div style="background: white;">
            <u-cell-item :arrow="false" use-label-slot :title-style="{'width': '100%'}" v-for="(item, index) in tbCollectUserGoodsList" :key="item.id">
                <div slot="icon" @click="gotoGoodsDetail(item)">
                    <myImg :obj="item" :sysFile="{fkId: item.tbGoods.id, typeMark: 'thumbnail'}" class="picture"
                           :customStyle="'pointer-events: none; height: 100px;  width:100px; background-size: cover; background-repeat: no-repeat; background-position: center;'"
                           :defaultUrl="'/pages/sub/sub1-tabs/static/default-image/goods.jpg'" :imageView="'imageView2/1/w/300/h/300'"></myImg>
                </div>
                <div slot="title" style="padding-left: 10px;">
                    <view @click="gotoGoodsDetail(item)">
                        {{item.tbGoods.title}}
                    </view>
                    <view style="color: grey;" @click="gotoGoodsDetail(item)">
                        {{item.tbGoods.subTitle | toEmptyStr}}
                    </view>
                    <view style="text-align: right;">
                        <u-button plain size="mini" @click="deleteStore(item, i)">移除收藏</u-button>
                    </view>
                </div>
                <div slot="label">
                </div>
                <div slot="right-icon">
                </div>
                <!--默认value属性-->
                <div>
                </div>
            </u-cell-item>
        </div>

        <div style="padding-top: 10px; padding-bottom: 10px;">
            <u-loadmore :status="pagination.status" bg-color="#eeeeee"/>
        </div>
    </view>
</template>

<script>

    import {TbCollectUserGoodsService} from "@/dev/services/tb-collect-user-goods.service";
    import {CommonUtil} from "@/dev/core/utils/common.util";
    import myImg from '@/components/my-img'

    export default {
        data() {
            return {
                tbCollectUserGoodsList: []
            }
        },
        components: {
            myImg
        },
        onLoad(options) {
            const _self = this
            this.doRefresh(this.tbCollectUserGoodsList);
        },
        methods: {
            /**
             * 加载更多数据中
             * @param infiniteScroll
             */
            doInfinite(infiniteScroll) {
                const _self = this;
                new TbCollectUserGoodsService().findTableListCascade({
                    pagination: _self.pagination,
                    data: {
                        communityId: _self.globalVariable.userInfo.tbCommunity.id,
                        userId: _self.globalVariable.userInfo.id,
                        orderBy: 'create_time desc'
                    },
                }).then(result => {
                    _self.pagination.refreshPage(result);
                    _self.tbCollectUserGoodsList = [..._self.tbCollectUserGoodsList, ...result.list];
                });
            },

            gotoGoodsDetail(item) {
                const _self = this;
                if (!item.isValidGoods) {
                    CommonUtil.alert('该商品已下架或已失效');
                    return;
                }
                if (!item.isOpenStore) {
                    CommonUtil.alert('该商品店铺尚未开店');
                    return;
                }
                this.navigateTo(`/pages/common/goods-detail/index?id=${item.goodsId}`)
            },

            /**
             * 删除收藏的店铺
             * @param item
             */
            deleteStore(item, index) {
                const _self = this;
                CommonUtil.alert({
                    title: '提示！',
                    content: '确定移除收藏吗？',
                    showCancel: true, // 是否显示取消按钮
                    success: function (res) {
                        if (res.cancel) { // 点击取消,默认隐藏弹框
                        } else { // 点击确定
                            new TbCollectUserGoodsService().deleteTbCollectUserGoods({id: item.id}).then(result => {
                                _self.tbCollectUserGoodsList.splice(index, 1);
                            });
                        }
                    }
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
</style>
